<template>
	<view class="company-list-content-item"  >
		<view class="top isDisplay">
			<img :src="companyData?.logo" alt="" />
			<view class="company-name"><text style="color: rgba(102, 110, 122, 1);font-size: 27.52rpx;">{{companyData?.name}}</text></view>
			<img src="../static/images/icon.png" alt="" style="margin-left: 100rpx;" />
		</view>
		<view class="job-name">
			<text style="color: rgba(40, 33, 31, 1);font-size:32.11rpx ;">UI设计师</text>
		</view>
		<view>
			<view class="job-position">
				<text style="color:rgba(102, 110, 122, 1) ;font-size: 25.23rpx;">{{companyData?.location.adress}}</text>
				<text style="font-size: 25.23rpx;color:rgba(253, 119, 83, 1) ;">全职</text>
			</view>
		</view>
		<view style="margin-bottom:30rpx">
			<text style="color:rgba(102, 110, 122, 1) ;font-size: 25.23rpx;">{{companyData?.description}}</text>
		</view>
		<view class="isDisplay">
			<view class="isDisplay" style="margin-right: 30rpx;">
				<view class="img-view"><img src="../static/images/user.png" alt="" /></view>
				<text>200</text>
			</view>
			<view class="isDisplay">
				<view class="img-view"><img src="../static/images/Show.png" alt="" /></view>
				<text>343</text>
			</view>
			<view style="margin-left: 300rpx;">
				<text style="color:rgba(102, 110, 122, 1) ;font-size: 25.23rpx;">3小时前</text>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
import type { CompanyType } from '@/model/company';

	defineProps<{
		companyData:CompanyType
	}>()
		
</script>

<style>
.isDisplay{
	display: flex;
}
.company-list-content-item{
    flex: 0 0 auto;
	width: 700rpx;
	height: 447.25rpx;
	border:#EEEEEE 2rpx solid ;
	padding: 35rpx;
	border-radius: 10rpx;
	margin-bottom: 30rpx;
}
.company-list-content-item .top{
	margin-bottom: 30rpx;
	height:50rpx ;
}
.company-list-content-item .top img{
	width:45.87rpx ;

}
.company-list-content-item .company-name{
	width: 401.83rpx;
	margin:0 20rpx ;
	height:50.46rpx ;
	overflow: hidden; /* 超出部分隐藏 */
	white-space: nowrap; /* 禁止换行 */
	text-overflow: ellipsis; /* 超出显示省略号 */
}
.job-name{
	margin-bottom: 20rpx;
	height:50.46rpx ;
	
}
.job-position{
	margin-bottom: 20rpx;
	height: 36.7rpx;
}
.img-view{
	width:36.7rpx ;
	height:36.7rpx ;
	margin-right: 15rpx;
}
</style>